
<!doctype html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
  <meta name="description" content="">
  <meta name="author" content="">
  <link rel="icon" href="https://cdn.jsdelivr.net/npm/@bootcss/v3.bootcss.com@1.0.14/favicon.ico">
  <link rel="canonical" href="https://getbootstrap.com/docs/3.4/examples/signin/">
  <link href="css/bootstrap-theme.css" type="text/css">
  <link href="css/bootstrap.css" type="text/css">
  <script type="text/javascript" src="https://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
  <script src="js/bootstrap.js"></script>
  <title>在线书城用户登录</title>

  <!-- Bootstrap core CSS -->
  <link href="https://cdn.jsdelivr.net/npm/@bootcss/v3.bootcss.com@1.0.14/dist/css/bootstrap.min.css" rel="stylesheet">

  <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
  <link href="https://cdn.jsdelivr.net/npm/@bootcss/v3.bootcss.com@1.0.14/assets/css/ie10-viewport-bug-workaround.css" rel="stylesheet">

  <!-- Custom styles for this template -->
  <link href="https://cdn.jsdelivr.net/npm/@bootcss/v3.bootcss.com@1.0.14/examples/signin/signin.css" rel="stylesheet">

  <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
  <!--[if lt IE 9]><script src="https://cdn.jsdelivr.net/npm/@bootcss/v3.bootcss.com@1.0.14/assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
  <script src="https://cdn.jsdelivr.net/npm/@bootcss/v3.bootcss.com@1.0.14/assets/js/ie-emulation-modes-warning.js"></script>

  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
  <!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  <![endif]-->
  <style>
    .sethigh{
      height: 11px;
      font-size: 20px;
    }
  </style>
</head>

<body>

<div class="container">

  <form class="form-signin">
    <h2 class="form-signin-heading">在线书城用户登录</h2>
    <label for="inputEmail" class="sr-only">用户名</label>
    <input type="email" id="inputEmail" class="form-control" placeholder="用户名" required autofocus>


    <label for="inputPassword" class="sr-only">密码</label>
    <input type="password" id="inputPassword" class="form-control" placeholder="密码" required>
    <label for="inputPassword1" class="sr-only">再次输入密码</label>
    <input type="password" id="inputPassword1" class="form-control" placeholder="密码" required>

    <label class="sethigh">性别</label>
    <input type="radio"  class="input-lg sethigh"  placeholder="性别" required name="gender" id="man" checked><label for="man" class="sethigh">男</label>
    <input type="radio"  class="input-lg sethigh" placeholder="性别" required name="gender" id="woman"><label for="woman" class="sethigh">女</label>

    <label for="inputEmails" class="sr-only">邮件</label>
    <input type="email" id="inputEmails" class="form-control" placeholder="邮件" required>

    <label for="inputtelephone" class="sr-only">电话号</label>
    <input type="number" id="inputtelephone" class="form-control" placeholder="电话号" required>

    <label for="inputintroduce" class="sr-only">个人介绍</label>
    <input type="text" id="inputintroduce" class="form-control" placeholder="个人介绍" required>

    <label for="inputactiveCode" class="sr-only">激活码</label>
    <input type="text" id="inputactiveCode" class="form-control" placeholder="激活码" required>

    <div class="checkbox">
      <label>
        <input type="checkbox" value="remember-me"> 记住我
      </label>
    </div>
    <button class="btn btn-lg btn-primary btn-block" type="button" id="btnlogin">登录</button>
  </form>

</div> <!-- /container -->


<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="https://cdn.jsdelivr.net/npm/@bootcss/v3.bootcss.com@1.0.14/assets/js/ie10-viewport-bug-workaround.js"></script>
<script type="text/javascript" src="https://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@8"></script>
</body>
<script type="text/javascript">
  function alertFun(num,txt) {
    if (num == 0) {
      Swal.fire({
        type: 'error',
        title: '失败提示.',
        text: '用户名或密码不能为空!',
        footer: '<a href>请检查用户名或密码是否正确</a>'
      })
    } else if (num==1){
      Swal.fire({
        position: 'top-middle',
        type: 'success',
        title: '注册成功',
        showConfirmButton: true,
        timer: 2500
      })
    }
    else {
      Swal.fire({
        type: 'error',
        title: '失败提示.',
        text: txt+'不能为空!',
        footer: '<a href>请检查'+txt+'不能为空</a>'
      })
    }
  }
  $(function(){
    $('#inputEmail').blur(function (){
      alertFun(3,"用户名");
    })
    $('#inputPassword').blur(function (){
      alertFun(3,"密码");
    })
    $('#inputPassword1').blur(function (){
      alertFun(3,"再次输入的密码");
    })
    $('#btnlogin').click(function (){
      var username = $('#inputEmail').val();
      var password = $("#inputPassword").val();
      var password1 = $("#inputPassword1").val();
      if (password!=password1){
        Swal.fire({
          type: 'error',
          title: '失败提示.',
          text: '两次密码不一致!',
          footer: '<a href>请检查两次密码是否一致</a>'
        })
        return;
      }
      var gender = $("input[type='radio']:checked").val();
      var email = $("#inputEmails").val();
      var telephone = $("#inputtelephone").val();
      var introduce = $("#inputintroduce").val();
      var activeCode = $("#inputactiveCode").val();
      $.ajax({
        async: true,
        url: "./user.do",
        type: "POST",
        data:{
          action: "register",
          username: username,
          password: password,
          gender:gender,
          email:email,
          telephone:telephone,
          introduce:introduce,
          activeCode:activeCode
        },
        success: function (data) {
          console.log(data)
          var data1 = JSON.parse(data);
          if(data1==0){
            alertFun(0);
          }else{
            alertFun(1,data1);
            window.setTimeout(function (){
              location.href="./login.html";
            },1000);
          }
        },
        dataType: "text"
      });
    })
  })
</script>
</html>
